import React, { useState } from 'react';
import { connect } from 'react-redux';
import { View, Button, Text } from '@tarojs/components';
import CodeInput from '@/components/CodeInput';
import Taro from '@tarojs/taro';
import './style.scss';

const GetVerification = ({}) => {
  const [passWorld, setPassWorld] = useState();
  const next = () => {
    if (passWorld.length !== 6) {
      Taro.showToast({
        title: '验证码有误',
        icon: 'none',
      });
    } else {
      Taro.navigateTo({ url: '/pages/checkstand/setPassword/index' });
    }
  };
  return (
    <View className="getVerification">
      <View className="phone-view">
        <Text className="text">当前手机号</Text>
        <View className="phon">188****7766</View>
      </View>
      <View className="code-view">
        <Text className="text-code-l">请输入验证码</Text>
        <View className="get-code-btn">重新获取58秒</View>
      </View>
      <CodeInput
        onChange={(val) => {
          console.log(val);
          setPassWorld(val);
        }}
        type="number"
      />
      <View className="btn-view-card">
        <Button className="btn-yellow" onClick={next}>
          下一步
        </Button>
      </View>
    </View>
  );
};
export default connect(({}) => ({}))(GetVerification);
